<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Extra-Map-App</title>

    <link rel="stylesheet" href="http://127.0.0.1/arcgis_js_api/library/4.4/esri/css/main.css">
    <link rel="stylesheet" href="css/mainApp.css">



    <script src="../dist/config.js"></script>

    <script src="http://127.0.0.1/arcgis_js_api/library/4.4/init.js"></script>
    <script>


        // Load the Map and MapView modules
        require(["esri/Map",
            "esri/views/MapView",
            "dextra/layers/GoogleImageLayer",
            "dojo/on","dextra/modules/toolbars/Draw","dextra/modules/measure/_measureDistance","dextra/modules/measure/_measureArea",
            "dojo/domReady!"], function(Map, MapView,GoogleImageLayer,domOn,Draw,_measureDistance,_measureArea) {

            var layer=new GoogleImageLayer();

            // Create a Map instance
            var myMap = new Map({
                //  basemap:"topo",
                layers:[layer]
            });
//           myMap.add(tdtVctLayer);
            // Create a MapView instance (for 2D viewing) and reference the map instance
            var view = new MapView({
                container:"viewDiv",
                map: myMap
            });



            var drawTool=new Draw({
                view:view
            })

            var distance=new _measureDistance({
                view:view
            });

            var area=new _measureArea({
                view:view
            });

            drawTool.on("draw-complete",function(evt){
                console.log(evt);
            })

            domOn(dojo.byId("drawbutton1"),"click",function(evt){
                drawTool.activate("point");
            });

            domOn(dojo.byId("drawbutton2"),"click",function(evt){
                drawTool.activate("polyline");
            });

            domOn(dojo.byId("drawbutton3"),"click",function(evt){
                drawTool.activate("polygon");
            });

            domOn(dojo.byId("drawbutton4"),"click",function(evt){
                drawTool.activate("circle");
            });

            domOn(dojo.byId("drawbutton5"),"click",function(evt){
                distance.start();
            });
            domOn(dojo.byId("drawbutton6"),"click",function(evt){
                area.start();
            });
        });
    </script>

</head>
<body>
<button id="drawbutton1">点</button>
<button id="drawbutton2">线</button>
<button id="drawbutton3">面</button>
<button id="drawbutton4">圆</button>
<button id="drawbutton5">距离</button>
<button id="drawbutton6">面积</button>
<div id="viewDiv"></div>
</body>
</html>